<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>小米官网</title>
    <link rel="stylesheet" href="css/index.css">
</head>
<body>
<div class="app">
    <div class="page-contrainer">
        <!-- header -->
        <div class="header">
            <div class="logo" >
                <a href="">
                    <img src="img/mi.jpg">
                </a>
            </div>
            <div class="nav">
                <div class="nav-item">
                    <a href="">小米官网</a>
                </div>
                <div class="nav-item">
                    <a href="">小米商城</a>
                </div>
                <div class="nav-item">
                    <a href="">小米澎湃OS</a>
                </div>
                <div class="nav-item">
                    <a href="">小米汽车</a>
                </div>
                <div class="nav-item">
                    <a href="">小米影像</a>
                </div>
                <div class="nav-item">
                    <a href="">云服务</a>
                </div>
                <div class="nav-item">
                    <a href="">IOT</a>
                </div>
                <div class="nav-item">
                    <a href="">有品</a>
                </div>
                <div class="nav-item">
                    <a href="">小爱开放平台</a>
                </div>
                <div class="nav-item">
                    <a href="">Location</a>
                </div>
            </div>
            <div class="nav-right">
                <div class="nav-item">
                    <a href="">登录</a><span class="span-with-line"></span>
                </div>
                <div class="nav-item">
                    <a href="">注册</a>
                </div>
            </div>
        </div>
        <div class="banner">
            <img src="https://img.youpin.mi-img.com/ferriswheel/da743320_48ec_40d0_b617_d70baca0a6d7.jpeg" alt="">
            <img src="https://s1.xiaomiev.com/activity-outer-assets/0328/images/su7/su7_1.jpg" alt="">
            <img src="https://cdn.cnbj1.fds.api.mi-img.com/product-images/xiaomi14proy4y29r/index/28064.png?x-fds-process=image/resize,q_90,f_webp" alt="">
            <img src="https://img.youpin.mi-img.com/ferriswheel/7f34b8b0_0d61_4e84_b7fe_7c45eb52d36c.jpeg@base@tag=imgScale&F=webp&h=1080&q=90&w=2560" alt="">
            <img src="https://img.youpin.mi-img.com/ferriswheel/923a4e31_32f6_45b3_95e8_8ca7f5a9f781.jpeg@base@tag=imgScale&F=webp&h=1080&q=90&w=2560" alt="">
            <img src="https://s1.xiaomiev.com/activity-outer-assets/0328/images/home/section2x1281.jpg" alt="">
        </div>
    </div>
    <!-- footer -->
    <div class="footer">
        <div class="footer-item">
            <nav>
                <ul>
                    <li>
                        <a href="">选购指南</a>
                    </li>
                    <li>
                        <a href="">手机</a>
                    </li>
                    <li>
                        <a href="">电视</a>
                    </li>
                    <li>
                        <a href="">笔记本</a>
                    </li>
                    <li>
                        <a href="">笔记本</a>
                    </li>
                    <li>
                        <a href="">智能硬件</a>
                    </li>
                    <li>
                        <a href="">路由器</a>
                    </li>
                    <li>
                        <a href="">智能生活</a>
                    </li>
                </ul>
                <ul>
                    <li>
                        <a href="">选购指南</a>
                    </li>
                    <li>
                        <a href="">手机</a>
                    </li>
                    <li>
                        <a href="">电视</a>
                    </li>
                    <li>
                        <a href="">笔记本</a>
                    </li>
                    <li>
                        <a href="">笔记本</a>
                    </li>
                    <li>
                        <a href="">智能硬件</a>
                    </li>
                    <li>
                        <a href="">路由器</a>
                    </li>
                    <li>
                        <a href="">智能生活</a>
                    </li>
                </ul>
                <ul>
                    <li>
                        <a href="">选购指南</a>
                    </li>
                    <li>
                        <a href="">手机</a>
                    </li>
                    <li>
                        <a href="">电视</a>
                    </li>
                    <li>
                        <a href="">笔记本</a>
                    </li>
                    <li>
                        <a href="">笔记本</a>
                    </li>
                    <li>
                        <a href="">智能硬件</a>
                    </li>
                    <li>
                        <a href="">路由器</a>
                    </li>
                    <li>
                        <a href="">智能生活</a>
                    </li>
                </ul>
                <ul>
                    <li>
                        <a href="">选购指南</a>
                    </li>
                    <li>
                        <a href="">手机</a>
                    </li>
                    <li>
                        <a href="">电视</a>
                    </li>
                    <li>
                        <a href="">笔记本</a>
                    </li>
                    <li>
                        <a href="">笔记本</a>
                    </li>
                    <li>
                        <a href="">智能硬件</a>
                    </li>
                    <li>
                        <a href="">路由器</a>
                    </li>
                    <li>
                        <a href="">智能生活</a>
                    </li>
                </ul>
            </nav>
            <div class="nav-right">
                <p>400-100-5678</p>
                <span >8:00-18:00（仅收市话费）</span>
                <a href="">人工服务</a>
                <p>400-100-8888</p>
                <span>8:00-18:00（仅收市话费）</span>
                <h6 class="footer-h6" style="margin-right: 60px !important;">适用于：MIX FOLD、巨屏电视系列</h6>
                <a href="">人工服务</a>
            </div>

        </div>

    </div>
</body>
</html>